<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>修改用户信息</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"
        integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>

<body class="col-sm-12" style="margin-top:5px ;">
    <div class="panel panel-info">
        <div class="panel-heading">
            <h3 class="panel-title">修改信息</h3>
        </div>

        <div class="panel-body">
            <!-- <form action="" method="POST" role="form"> -->
            <div class="form-group">
                <label for="">名字</label>
                <input type="text" class="form-control" id="txt1" placeholder="请输入姓名">
            </div>
            <div class="form-group">
                <label for="">性别</label>
                <input class="form-control" id="txt2" cols="30" rows="10" placeholder="请输入描述">
            </div>
            <div class="form-group">
                <label for="">地址</label>
                <input class="form-control" id="txt3" cols="30" rows="10" placeholder="请输入描述">
            </div>
            <div class="form-group">
                <label for="">电话</label>
                <input class="form-control" id="txt4" cols="30" rows="10" placeholder="请输入描述">
            </div>
            <div class="form-group">
                <label for="">邮箱</label>
                <input class="form-control" id="txt5" cols="30" rows="10" placeholder="请输入描述">
            </div>
            <div class="form-group">
                <label for="">描述</label>
                <textarea class="form-control" id="txt6" cols="30" rows="10" placeholder="请输入描述"></textarea>
            </div>
            <button type="submit" class="btn btn-primary btn-block" onclick="save()">提交</button>
            <!-- </form> -->
        </div>
    </div>
    </div>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
    <script>
        const name = document.querySelector("#txt1");
        const desc = document.querySelector("#txt6");
        const sex = document.querySelector("#txt2");
        const adr = document.querySelector("#txt3");
        const pho = document.querySelector("#txt4");
        const ema = document.querySelector("#txt5");

        const urlParams = new URLSearchParams(window.location.search);
        axios.get("/api/users/" + urlParams.get("id")).then((res) => {
            name.value = res.data.name;
            desc.value = res.data.desc
            sex.value = res.data.sex
            adr.value = res.data.address
            pho.value = res.data.phone
            ema.value = res.data.email
        })
        function save() {
            if (name.value && desc.value && adr.value && pho.value) {
                axios.put("/api/users/" + urlParams.get("id"), {
                    name: name.value,
                    desc: desc.value,
                    sex: sex.value,
                    address: adr.value,
                    email: ema.value,
                    phone: pho.value,
                }).then((res) => {
                    console.log(res)
                    if (res.data.code == 1) {
                        alert("修改成功")
                        // window.history.go(-1)
                        location.href = "/user.html"
                    }
                })
            } else {
                alert("请输入内容")
            }
        }

    </script>

</body>

</html>